include mixin
#servicedetail.ng-cloak.invisible(ng-class='{zuhe: !!product.extra2.zhid}')
	ul.breadcrumb
		li
			a(href='/portal/index') 首页
		li.sep >
		li
			a(href='#/service') 服务产品
		li.sep >
		li.cd {{product.title}}

	
	.product.relative
		#chart
			table.bc
				tr
					td(gf-chart='chartData', id='servicechart', style='height: 383px;width: 545px;', data-option="{compare: 'percent'}")

		#pic.tac
			img(src='img/blank.gif', gf-bg, gf-src='/_image/pdt_service_{{product.id}}', alt='产品图片').s116

		#productinfo
			//.pull-right 商品编号：{{product.code}}
			h2.title.nomp {{product.title}}
				a.prodexample(href='/portal/ruicombination.html', target='_blank', ng-show='product.id == 900023') 产品样例 >
			
			//-空白， 无描述内容时，页面也可以对齐
			{{product.description}}&nbsp;
			
			.line
				//- a(href='').pull-right.btn.small 购买咨询
				span.price ￥{{period.price}}元/{{periodLabel[period.period]}}

			.yui3-u.info
				div
					| 服务方式:&nbsp;{{product.channel_desc}}
					a.mlem.ljty(href='javascript:void(0);', ng-show='!online && tysc', ng-click='experience()') 立即体验>>
				div(ng-show='online && tysc')
					span.mrem 体验周期:&nbsp;{{tysc}}天
					a.ljty(href='javascript:void(0);', ng-click='experience()') 立即体验>>
				div
					| 用户评价:
					span(gf-star, gf-star-score="{{product.star}}")
				div
					| 购买周期:&nbsp;
					.ib
						select(ng-hide='dialog || serviceOrder.exists[product.id]', ng-options='periodLabel[p.period] for p in product.pricing', ng-model='period')
						span(ng-show='serviceOrder.exists[product.id]', ng-bind='periodLabel[serviceOrder.exists[product.id].djzq]')
				div(ng-show='!!product.extra2.zhid')
					span.invisible 折扣提示:&nbsp;
					.ib.vam.discount
				div(ng-switch='!!product.extra2.zhid')
					| 购买数量:&nbsp;
					select(ng-hide='dialog', ng-switch-when='true', ng-options='n for n in range(period.period).slice(0, 5)', ng-model="$parent.number")
					select(ng-hide='dialog', ng-switch-when='false', ng-options='n for n in range(period.period)', ng-model="$parent.number")
				div
					| 生效日期:&nbsp;T日购买, T+2日生效

			.box.mtop15(ng-show='!cart.exists[product.id] && serviceOrder.exists[product.id]')
				.ie6hori
					已选择: {{product.title}} &nbsp;总价:&nbsp;
					span.nc ￥{{period.price*number}}
				.tac
					//- button(ng-hide='product.offline', ng-click='purchase(product.id, serviceOrder.exists[product.id].djzq, number, 2, product)').btn.primary.mtop10.mlem 我要续订

			.box.mtop15(ng-show='!cart.exists[product.id] && !pocket.exists[product.id]')
				.ie6hori
					已选择: {{product.title}} &nbsp;总价:&nbsp;
					span.nc ￥{{period.price*number}}
					.tac(ng-show='!serviceOrder.exists[product.id]')
						button(ng-hide='product.offline', ng-click='addToCart({product_id: product.id, period: period.period, count: number, payment_type: paymentType})').btn.primary.minor.mtop10 加入购物车
						button(ng-hide='product.offline', ng-click='purchase_yht(product, product.id, period.period, number, paymentType, product)').btn.primary.mtop10.mlem 立即购买
						button(ng-show='product.offline', ng-click='dialog=true', title='简单登记您的信息，我们的工作人员将协助您完成购买。').btn.primary.mtop10 登记购买

					//- button(ng-hide='product.offline || !serviceOrder.exists[product.id]', ng-click='purchase(product.id, serviceOrder.exists[product.id].djzq, number, 2, product)').btn.primary.mtop10.mlem 我要续订

			.box.mtop15(ng-show='cart.exists[product.id] && !pocket.exists[product.id] && !serviceOrder.exists[product.id]')
				| 已经在购物车中！
				br
				a(href='#/cart').btn.primary.minor.mtop10 查看购物车
				a(ng-click='purchase_yht(product, product.id, period.period, number, paymentType, product)').btn.primary.mtop10.mlem 立即购买

			.box.mtop15(ng-show='pocket.exists[product.id] && !pocket.exists[product.id].dytcid && !serviceOrder.exists[product.id]')
				| 您已于&nbsp;
				date {{pocket.exists[product.id].service_dates[0]|date:'yyyy-MM-dd'}}
				| &nbsp;购买了该产品！
				br
				button(gf-popup='cancelProduct()', btn-cancel='放弃', btn='确定', msg='您确定要取消购买该产品吗？').btn.primary.mtop10 取消购买

		.border.mtop20.moneyPackage(ng-show='packagePro && packagePro.length')
			.pad15
				h2.nomp 省钱组合套餐
					span.font12.nor.mleft45(ng-show='pocket.exists[product.id] && pocket.exists[product.id].dytcid')
						| 您已于&nbsp;
						date {{pocket.exists[product.id].service_dates[0]|date:'yyyy-MM-dd'}}
						| &nbsp;购买了该省钱组合套餐！

				.yui3-g.mtop15(ng-repeat='pro in packagePro')
					.yui3-u.graybg.product1.padbottom10
						.yui3-u.pad15
							a(href='#/service/detail?pid={{pro.extra2.children_products[0].id}}')
								img(src='img/blank.gif', gf-src='/_image/pdt_service_{{pro.extra2.children_products[0].id}}', alt='产品图片', width='60px', height='60px')

						.yui3-u.mtop8
							.b.font14.oneline(style='width: 92px;')
								a(href='#/service/detail?pid={{pro.extra2.children_products[0].id}}', ng-bind='pro.extra2.children_products[0].title', title='{{pro.extra2.children_products[0].title}}')
							.afc.oneline(style='width: 92px;', title='{{pro.extra2.children_products[0].description}}') {{pro.extra2.children_products[0].description || "&nbsp"}}
							.font14 
								| 原价 : 
								span(style='color: #ff6000', ng-bind='pro.extra2.children_products[0].pricing[0].price*number')
								span.font12 元/
								span(ng-bind='periodLabel[pro.extra2.children_products[0].pricing[0].period]')

					.yui3-u.plus
					.yui3-u.graybg.product1.padbottom10
						.yui3-u.pad15
							a(href='#/service/detail?pid={{pro.extra2.children_products[1].id}}')
								img(src='img/blank.gif', gf-src='/_image/pdt_service_{{pro.extra2.children_products[1].id}}', alt='产品图片', width='60px', height='60px')

						.yui3-u.mtop8
							.b.font14.oneline(style='width: 92px;')
								a(href='#/service/detail?pid={{pro.extra2.children_products[1].id}}', ng-bind='pro.extra2.children_products[1].title', title='{{pro.extra2.children_products[1].title}}')
							.afc.oneline(style='width: 92px;', title='{{pro.extra2.children_products[1].description}}') {{pro.extra2.children_products[1].description || "&nbsp"}}
							.font14 
								| 原价 : 
								span(style='color: #ff6000', ng-bind='pro.extra2.children_products[1].pricing[0].price*number')
								span.font12 元/
								span(ng-bind='periodLabel[pro.extra2.children_products[1].pricing[0].period]')

					.yui3-u.equals
					.yui3-u-1-4.mtop8.product2
						div(ng-show='!cart.exists[pro.id] && !product.offline')
							h3.nomp.font13.b
							| 组合价 : 
							span.font16(style='color: #ff6000', ng-bind='pro.pricing[0].price*number')
							| 元/月
							.afc
								| 节省 : 
								span.b(style='color: #ff6000', ng-bind='(pro.extra2.children_products[0].pricing[0].price + pro.extra2.children_products[1].pricing[0].price - pro.pricing[0].price)*number')
								| 元/月
							.mtop5(ng-show='!pocket.exists[pro.id]')
								span(ng-click='$parent.addToCart({product_id: pro.id, period: pro.pricing[0].period, count: number, payment_type: paymentType})').purchaseCombination.wc.font14.cp 购买组合

							.mtop5(ng-show='pocket.exists[pro.id]')
								span(gf-popup='cancelProduct()', btn-cancel='放弃', btn='确定', msg='您确定要取消购买该产品吗？').purchaseCombination.wc.font14.cp 取消购买

						div(ng-show='cart.exists[pro.id] && !pocket.exists[pro.id]')
							div 已经在购物车中！
							.mtop15
								a(href='#/cart').purchaseCombination.wc.font14 查看购物车
		
			mixin dialog

		aside#aside.yui3-u-1-4
			mixin hottest
			mixin history

		#productdetail
			.mtop40(style='color:#333', ng-bind-html-unsafe='product.extra.demo', ng-show='product.extra.demo')
			.mtop20(ng-bind-html-unsafe='introduce')

	div(ng-show='showLjtyDlg')
		.gf-mask
		.dialog3.gf-dialog(fixed=1)
			.dialog-close(ng-click='showLjtyDlg = false;')
			.dialog-title
				span.font18.mleft20 提示
			.container
				.dialog-txtpanel
					.dialog-txtie67
						.ib.mright15.vat.dialog-question
						.ib
							.font20.ib.nfc.vam 您的免费体验周期为{{tysc}}天，
							.mtop20.font20 您是否需继续体验？
				div
					button.dialog-btnok.font13.mright15(ng-click='purchase_yht(product, product.id, tysc, 0, tyPaymentType, true);showLjtyDlg=false;') 确&nbsp;定
					button.dialog-btncancel.font13.mright15(ng-click='showLjtyDlg=false;') 取&nbsp;消

	div(ng-show='showBindingDlg')
		.gf-mask
		.dialog3.gf-dialog(fixed=1, style='width: 946px;height: 451px;')
			.dialog-close(ng-click='showBindingDlg = false;')
			.dialog-title
				span.font18.mleft20 提示
			.bindingTip.dlgtip
				span.font14 尊敬的&nbsp;
				span.lbc.font28 {{session.display_name}}
				.mtop25
					img(src='img/w_bg1.gif')
				.yui3-g.mtop40.mbottom25
					.yui3-u.yykhpane
						.pad30.graybg.mright30
							.font20
								span.bc 您还
								span.orc 不是
								span.lbc 广发通会员?
							.mtop15.font14 您可以：
							.mtop25
								a(href='/#/register')
									img(src='img/reg.gif')
					.yui3-u.padleft40
						.pad30.graybg.mleft30
							.font20
								span.bc 您已经
								span.orc 是
								span.lbc 广发通会员?
							.mtop15.font14 您可以：
							.mtop25
								a(href='/#/invite')
									img(src='img/bind.gif')